<template>
  <el-form  :model="queryParams" :inline="true" >
    <slot name="queryItem" :query-params="queryParams"></slot>
    <el-form-item label="所属考核计划"  v-if="noAssess === undefined || noAssess === false">
      <el-select @change="changeByAssess"
        v-model="queryParams.assessmentId"  placeholder="请选择"  :clearable="false" size="small">
        <el-option
          v-for="item in AssessmentOptions"
          :key="item.value"
          :label="item.name"
          :value="item.value"
        ></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="所属考核方案"  v-if="noProgramme === undefined || noProgramme === false">
      <el-select
        style="width: 200px"  v-model="queryParams.programmeId"  placeholder="请选择"  clearable size="small">
        <el-option
          v-for="item in ProgrammeOptions"
          :key="item.value"
          :label="item.name"
          :value="item.value"
        ></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="所属部门" v-if="noDept === undefined || noDept === false">
      <el-select style="width: 200px"  v-model="queryParams.deptId"  placeholder="请选择"   :clearable="deptClear === undefined || deptClear === true" size="small">
        <el-option
          v-for="item in deptOptions"
          :key="item.value"
          :label="item.name"
          :value="item.value"
        ></el-option>
      </el-select>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
      <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
    </el-form-item>
  </el-form>

</template>

<script>
  import request from '@/utils/request'
  export default {
    name: 'basicQueryForm',
    props: {
      pattern: undefined,
      deptType: undefined,
      noAssess: undefined,
      noProgramme: undefined,
      noDept: undefined,
      deptClear: undefined
    },
    data() {
      return{
        queryParams: {
          deptId: undefined,
          assessmentId: undefined,
          programmeId: undefined,
          pageNum: 1,
          pageSize: 10
        },
        AssessmentOptions:[],
        ProgrammeOptions:[],
        deptOptions:[],
        curAssess: {},
        curProgramme: {},
        curDept: {}
      }
    },
    created() {
      this.getStaticQueryOption();
    },
    methods: {
      //查询表头
      getStaticQueryOption() {
        this.loading = true;
        request({
          url: '/kh/statistic/queryOptions' + '' + '?pattern=' + (this.pattern === undefined ? '' : this.pattern )+ '&&deptType=' + this.deptType,
          method: 'get',
        }).then(response => {
          this.loading = false;
          this.AssessmentOptions = response.data;
          this.initByRouter();
          this.initByAssess();
          this.handleQuery();
        });
      },
      initByRouter(){
        if(this.$route.params.assessmentId){
          this.queryParams.assessmentId = parseInt(this.$route.params.assessmentId);
        }
        if(this.$route.params.programmeId){
          this.queryParams.programmeId = parseInt(this.$route.params.programmeId);
        }
      },
      initByAssess() {
        if ((!Array.isArray(this.AssessmentOptions))  || this.AssessmentOptions.length === 0) return;

        if(this.queryParams.assessmentId === undefined || this.queryParams.assessmentId === ''){
          this.queryParams.assessmentId = this.AssessmentOptions[0].value;
        }

        var curAssess= this.AssessmentOptions.find(item => item.value === this.queryParams.assessmentId);
        if (!curAssess) return;
        this.ProgrammeOptions = curAssess.programmes;
        this.deptOptions = curAssess.depts;
        this.deptClearAction();
      },
      changeByAssess() {
        if (!this.AssessmentOptions) return;
        var curAssess = this.AssessmentOptions.find(item => item.value === this.queryParams.assessmentId);
        if (!curAssess) return;

        this.queryParams.deptId = undefined;
        this.queryParams.programmeId = undefined;
        this.ProgrammeOptions = curAssess.programmes;
        this.deptOptions = curAssess.depts;
        this.deptClearAction();
      },
      deptClearAction(){
        if(this.deptClear === false && !this.queryParams.deptId){
          this.queryParams.deptId = this.deptOptions[0].value;
        }
      },
      //搜索按钮始终为1
      handleQuery() {
        this.setPage({
          pageNum : 1
        });
        this.$emit("doQuery", this.queryParams);
      },
      //分页根据传入数据
      pageQuery(page) {
        this.setPage(page);
        this.$emit("doQuery", this.queryParams);
      },
      /** 重置按钮操作 */
      resetQuery() {
        Object.keys(this.queryParams)
          .filter(k => k !== "pageNum" && k !== "pageSize")
          .forEach(k=> this.queryParams[k] = undefined);
        this.ProgrammeOptions = undefined;
        this.deptOptions = undefined;
        this.initByRouter();
        this.initByAssess();
        //重置后查询首页 页面大小不变
        this.setPage({
          pageNum: 1
        })
        this.$emit("resetQuery",this.queryParams)
      },
      setPage(page){
        if(!page) return;
        let props = ["pageNum","pageSize"];
        props.forEach(e => {
          if(page.hasOwnProperty(e)){
            this.queryParams[e] = page[e]
          }
        })
      }
    },
    }
</script>

<style scoped>

</style>
